import { Space } from "antd-mobile"
import type { ICustomerItem } from "../../interface/IlistItem"
import "./CustomItem.scss"
import { DeleteOutline, EditSOutline } from "antd-mobile-icons"
import { useNavigate } from "react-router-dom"
import querystring from "querystring"
import { useDispatch } from "react-redux"
import { delCareness } from "../../store/UserSlice"
import { Dialog } from "antd-mobile"

function CustomItem(props: { itemData: ICustomerItem }) {
    const { itemData } = props
    const navigate = useNavigate()
    const dispatch = useDispatch()
    return (
        <>
            <div className="cardItem">
                <h4>
                    <span>{`${itemData.name}(${itemData.sex[0] === "1" ? "男" : "女"})${itemData.position ? "-" + itemData.position : ""}`}</span>
                    <span>
                        <Space>
                            <EditSOutline onClick={() => {
                                navigate(`/add/detail?id=${itemData.id}`)
                            }} />
                            <DeleteOutline onClick={async () => {
                                const result = await Dialog.confirm({
                                    title: "删除",
                                    content: '确定删除此重要客户喜好&禁忌吗？'
                                })
                                console.log(result)
                                if (result) {
                                    dispatch(delCareness(itemData.id))
                                }
                            }} />
                        </Space>
                    </span>
                </h4>
                <div className="tel">{itemData.telephone}</div>
                <p>用车：{itemData.carCon ? itemData.carCon : "无"}</p>
                <p>用餐：{itemData.dinnerCon ? itemData.dinnerCon : "无"}</p>
                <p>住宿：{itemData.hotelCon ? itemData.hotelCon : "无"}</p>
            </div>
        </>
    )
}
export default CustomItem